<template>
  <detail-dialog modal showReset :title="title" :show.sync="show" @reset="resetForm" @update:show="updateShow" :top="5" @save="save">
    <el-form :model="editOrderInfo" label-width="140px" :rules="rules" ref="orderInfoForm">
      <el-form-item label="联系人" prop="receiptContactsCode">
        <PopoverSearch
          width="90%"
          @hide="selectContracts"  placeholder="+添加联系人"
           type='customerSigner' :params="{customerCode:editOrderInfo.customerCode}"  :disabled="!(editOrderInfo.customerCode && editOrderInfo.customerCode!==null)"   v-model="editOrderInfo.receiptContactsCode" valueKey="contactsCode" lableKey="contactsName"
          :name.sync="editOrderInfo.receiptContactsName"/>
        </el-form-item>
        <el-form-item label="联系人地址" prop="receiptAddress">
              <el-input
              style="width: 90%"
                v-model="editOrderInfo.receiptAddress"
                placeholder="联系人地址" clearable
              ></el-input>
            </el-form-item>
        <el-form-item label="联系人手机" prop="receiptContactsMobile">
              <el-input
              style="width: 90%"
                v-model="editOrderInfo.receiptContactsMobile"
                placeholder="联系人手机" readonly
                maxlength="11"
              ></el-input>
      </el-form-item>
            <el-form-item label="联系人邮箱" prop="receiptContactsEmail">
              <el-input
                style="width: 90%"
                v-model="editOrderInfo.receiptContactsEmail"
                placeholder="联系人邮箱" clearable
              ></el-input>
            </el-form-item>
      <el-form-item label="备注" prop="receiptRemark">
        <el-input
          style="width: 90%"
          type="textarea"
          v-model="editOrderInfo.receiptRemark"
          placeholder="备注"
        ></el-input>
      </el-form-item>
    </el-form>
  </detail-dialog>
</template>
<script>
import DetailDialog from '@/components/DetailDialog'
import PopoverSearch from '@/views/components/popoverSearch'
import Mixins from '../../mixins'
export default {
  name: 'order_receipt',
  props: {
    title: {type: String, default: '编辑收货地址信息'},
    visible: {
      type: Boolean,
      default: false
    },
    param: {type: Object,
      default: () => {
        return {}
      }}
  },
  components: { DetailDialog, PopoverSearch },
  mixins: [Mixins],
  watch: {
    param: {
      handler (nVal, oVal) {
        this.originalOrderInfo = {...nVal}
      },
      deep: true,
      immediate: true
    },
    visible: {
      handler (val) {
        this.show = val
        this.editOrderInfo = {...this.param}
      },
      immediate: true
    },
    show (nVal) {
      this.$emit('update:visible', nVal)
    }
  },
  data () {
    return {
      editOrderInfo: {},
      originalOrderInfo: {},
      show: this.visible,
      salesOrderStatus: [],
      rules: {
        receiptContactsCode: [{ required: true, message: '不能为空', trigger: 'blur' }],
        receiptAddress: [{ required: true, message: '不能为空', trigger: 'blur' }],
        receiptContactsMobile: [{ required: true, message: '不能为空', trigger: 'blur' }]
      }
    }
  },
  methods: {
    selectContracts (data) {
      if (data.contactsCode !== this.editOrderInfo.receiptContactsCode) {
        this.$set(this.editOrderInfo, 'receiptAddress', data.address)
        this.$set(this.editOrderInfo, 'receiptContactsEmail', data.email)
        this.$set(this.editOrderInfo, 'receiptContactsMobile', data.mobile)
      }
    },
    save () {
      this.$refs.orderInfoForm.validate(valid => {
        if (valid) {
          const params = {}
          params.orderNo = this.editOrderInfo.orderNo
          params.receiptContactsCode = this.editOrderInfo.receiptContactsCode
          params.receiptContactsName = this.editOrderInfo.receiptContactsName
          params.receiptAddress = this.editOrderInfo.receiptAddress
          params.receiptContactsMobile = this.editOrderInfo.receiptContactsMobile
          params.receiptContactsEmail = this.editOrderInfo.receiptContactsEmail
          params.receiptRemark = this.editOrderInfo.receiptRemark
          this.requestOption('updateSalesOrder', params, res => {
            this.updateShow(false)
            this.$emit('saveAfter', this.editOrderInfo.orderNo)
          })
        }
      })
    },
    updateShow (val) {
      this.show = val
    },
    resetForm () {
      this.editOrderInfo = {...this.originalOrderInfo}
      // this.$refs.orderInfoForm.resetFields()
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
